<template>
	<view class="content">
		<!-- <image mode="widthFix" src="/static/logo2.png" class="swiperLogo"></image> -->
		<view class="uni-margin-wrap">
			<view class="search flex align">
				<view class="address" @click="toUrl('/pages/weather/weather')">
					<view class="addressName">高新区</view>
					<view class="flex align" v-if="weather!=''">
						<image style="width: 40rpx;height: 40rpx;" :src="getWeatherIcon(weather.weather)"
							mode="widthFix"></image>
						{{weather.temperature}}℃
					</view>
					<!-- <view class="flex align"><u-icon name="calendar" color="#fff"></u-icon>{{time}} </view> -->
					<!-- <view v-if="weather!=''||time!=''"> {{weather.weather}} {{weather.temperature}}℃</view> -->
				</view>
				<view style="width: 78%;">
					<u-search bgColor="RGBA(255, 255, 255, 0.7)" :actionStyle="actionStyle" placeholder="搜索关键字"
						:showAction="true" v-model="keyword" @custom="toSearch()"></u-search>
				</view>
			</view>
			<swiper class="swiper" circular indicator-active-color="#fff" :indicator-dots="indicatorDots"
				:autoplay="autoplay" :interval="interval" :duration="duration">
				<swiper-item v-for="(item,index) in bannerList" :key="index">
					<view style="position: relative;width: 100%;height: 100%;">
						<image :src="item.path" mode="aspectFill" @click="toUrl(item.url,item.path,item.description)">
						</image>
						<view class="swiper-title flex align">
							<!-- <u-icon name="map-fill" color="#fff"></u-icon> -->
							{{item.title}}
						</view>
					</view>
				</swiper-item>
			</swiper>
		</view>
		<view class="navView">
			<view class="navs flex align between">
				<view class="nav-item" v-for="(item,index) in navList" :key="index" @click="toUrl(item.url)">
					<image :src="item.path"></image>
					<view>{{item.title}}</view>
				</view>
			</view>
		</view>
		<view class="video" style="height: 400rpx;position: relative;">
			<view class="videoTab">精品视频</view>
			<swiper class="swiper2" circular vertical indicator-active-color="#fff" :autoplay="autoplay"
				:interval="interval" :duration="500">
				<swiper-item v-for="(item,index) in srcList" :key="index">
					<view style="width: 100%;height: 100%;position: relative;">
						<!-- <video :src="item.src[1]" :poster="item.src[0]" style="object-fit: cover;"></video> -->
						<image :src="item.src[0]" style="border-radius: 20rpx;" class="img" mode="aspectFill"
							@click="toShow(item.src[1])"></image>
						<view class="img-name"
							style="position: absolute;bottom: 0;left: 0;color: white;padding: 20rpx;font-size: 28rpx;font-weight: bold;">
							{{item.title}}
						</view>
					</view>
				</swiper-item>
			</swiper>

		</view>
		<view class="actView" style="margin-top: 20rpx;" @click="toUrl('/pages/activity/activity')">
			<image mode="widthFix" src="/static/bg4.png" class="actBg"></image>
			<view class="actViewTex">
				<view class="Tex">{{actiTit.title}}</view>
				<view class="Tex">{{actiTit.description}}</view>
			</view>

		</view>
		<view class="actView">
			<image :src="bannerCar" @click="toUrl('','',feiUrl)" class="bannerCar" mode="widthFix" style="width: 100%;"></image>
		</view>
		<!-- <view class="video" v-if="srcList.length!=0">
				<smm-video poster="https://gxtravel.ncscloudmedia.com/uploads/png/20250701/8d1fb175e2f7c619f02b29490ce731b5.png" :srcList="srcList" :isDirectory="false" :isDanmu.sync="isdanmu" :isDanmuBtn="isdanmuBtn"
					:danmuList='danmuList'></smm-video>
		</view> -->
		<view class="uni-margin-wrap" style="margin-top: 0;">
			<swiper class="swiper swiper3" circular indicator-active-color="#fff" :indicator-dots="indicatorDots"
				:autoplay="autoplay" :interval="interval" :duration="duration">
				<swiper-item v-for="(item,index) in bannerList2" :key="index">
					<view style="position: relative;width: 100%;height: 100%;">
						<image :src="item.path" mode="aspectFill" @click="toUrl(item.url,item.path,item.description)">
						</image>
						<view class="swiper-title flex align">
							<!-- <u-icon name="map-fill" color="#fff"></u-icon> -->
							{{item.title}}
						</view>
					</view>
				</swiper-item>
			</swiper>
		</view>
		<!-- 推荐 -->
		<view class="main-list">
			<image class="list-bg" src="/static/index/bg3.png"></image>
			<!-- <view class="list-tit">
				<image mode="widthFix" src="/static/index/bg1.png"></image>
				<view>活动推荐</view>
			</view> -->
			<!--  @click="toUrl('/pages/activity/activity')" -->
			<!-- <view class="zixunList" @click="toUrl('/pages/activity/activity')">
				<other-page></other-page>
			</view> -->

			<!-- <view class="zixunNav">
				<view :class="act2==2?'list-tit':'list-tit3'" @click="toAct2(2)">
					<image mode="widthFix" src="/static/index/bg1.png" v-if="act2==2"></image>
					<view>路线推荐</view>
				</view>
			</view> -->
			<view class="zixunNav flex align" style="position: relative;">
				<view class="list-tit list-tit3">
					<image mode="widthFix" src="/static/index/bg1.png"></image>
					<view>路线推荐</view>
				</view>
				<navigator url="/pages/scenic/scenic?category_id=2" hover-class="none" class="more flex"
					style="position: absolute;right:0;color: grey;">更多<u-icon name="arrow-right"></u-icon></navigator>
			</view>
			<view class="gonglue">
				<navigator :url="'/pages/route/detail?id='+item.id" hover-class="none" class="gongList"
					v-for="(item,index) in list" :key="index">
					<view class="image">
						<image :src="item.cover" mode="aspectFill"></image>
						<view class="name">{{item.name}}</view>
					</view>
					<view class="infos">
						<view class="title flex align">
							<u-icon name="map-fill"></u-icon>
							<view>{{item.address}}</view>
						</view>
						<view class="flex align between eye">
							<view class="eye-item flex align">
							</view>
							<view class="eye-item flex align">
								<u-icon name="eye-fill"></u-icon>
								<!-- <image src="/static/index/eye.png"></image> -->
								<view>{{item.pv}}</view>
							</view>

						</view>
					</view>
				</navigator>
			</view>
			<xw-empty :isShow="empty" text="暂无数据" textColor="#777777"></xw-empty>
			<!-- 资讯 -->
			<view class="zixunNav flex align" style="position: relative;">
				<view class="list-tit list-tit3">
					<image mode="widthFix" src="/static/index/bg1.png"></image>
					<view>【热门资讯】</view>
				</view>
				<navigator url="/pages/news/news?name=热门资讯" hover-class="none" class="more flex"
					style="position: absolute;right:0;color: grey;">更多<u-icon name="arrow-right"></u-icon></navigator>
			</view>
			<view class="zixunList">
				<navigator :url="'/pages/news/detail?id='+item.id" hover-class="none" class="bookList flex align"
					v-for="(item,index) in articleList" :key="index">
					<image :src="item.cover" mode="aspectFill"></image>
					<view class="list-right">
						<view class="tit">{{item.title}}</view>
						<!-- <view class="info">红谷滩区沙井街道打造的邻里中心让居民享受多种服</view> -->
						<view class="eye flex between">
							<view class="flex align"><u-icon name="clock"></u-icon>{{item.create_time}}</view>
							<view class="flex align"><u-icon name="eye"></u-icon>{{item.pv}}</view>
						</view>
					</view>
				</navigator>
				<xw-empty :isShow="articleList.length==0" text="暂无数据" textColor="#777777"></xw-empty>
			</view>
		</view>
		<!-- 底部导航 -->
		<view class="btom-view">
			<image src="/static/nav/btom1.png" class="btom-bg"></image>
			<!-- <view class="btom-black"></view> -->
			<view class="bto-item bto-item-a">
				<image src="/static/nav/nav1-a.png"></image>
				<view>首页</view>
			</view>
			<view class="bto-item bto-item2" @click="toUrl('/pages/map/map')">
				<image src="/static/nav/nav2.png"></image>
				<view>文旅地图</view>
			</view>
			<view class="bto-item bto-item3" @click="toUrl('/pages/mine/mine')">
				<image src="/static/nav/nav3.png"></image>
				<view>我的</view>
			</view>
		</view>
		<u-popup :show="showVideo" mode="center" @close="close" :closeable="true">
			<view style="width: 700rpx;">
				<video style="width: 100%;" :src="'https://gxtravel.ncscloudmedia.com/'+video" controls
					id="myVideo"></video>
			</view>
		</u-popup>
		<!-- 返回顶部按钮 -->
		<view class="back-to-top" v-if="showBack" @click="handleTop">
			<image src="/static/top.png" mode="widthFix"></image>
		</view>
	</view>

</template>

<script>
	import {
		positionList,
		articleList,
		scenicCategory,
		scenicList,
		positionDetail,
		wechatLogin,
		userDetail,
		config
	} from '@/api/apiData.js';
	import wx from 'weixin-js-sdk'
	// import swiperTab from "@/components/swiperTab/swiperTab.vue";
	import OtherPage from '@/pages/other-page/other-page.vue'
	export default {
		components: {
			OtherPage
		},
		data() {
			return {
				showBack: false,
				actionStyle: {
					// background:'#fff',
					color: '#fff'
				},
				video: '',
				muted: false,
				act: 2,
				act2: 2,
				keyword: '',
				text1: '南昌市高新区欢迎您南昌市高新区欢迎您',
				title: 'Hello',
				indicatorDots: true,
				autoplay: true,
				interval: 3050,
				duration: 500,
				scrollList: [{
					imgurl: '/static/banner.png',
					name: '高新区图书馆'
				}, {
					imgurl: '/static/banner2.png',
					name: '高新区图书馆2'
				}, {
					imgurl: '/static/banner.png',
					name: '高新区图书馆3'
				}],
				navList: [],
				videoContext: null,
				video: false,
				bannerList: [],
				bannerList2: [],
				scenicList1: [],
				scenicList2: [],
				scenicList3: [],
				scenicList4: [],
				scenicList5: [],
				scenicList6: [],
				foodList1: [],
				foodList2: [],
				foodList3: [],
				foodList4: [],
				foodList5: [],
				foodList6: [],
				foodList7: [],
				articleList: [],
				totalPage: 1,
				page: 0,
				offset: 20,
				list: [],
				scrollTop: 0,
				empty: false,
				loadText: {
					loadmore: '点击或上拉加载更多',
					loading: '努力加载中',
					nomore: '实在没有了'
				},
				status: 'loadmore',
				category_id: 2,
				routeList: [],
				videoPath: '',
				info: '',
				weather: '',
				appid: '',
				srcList: [],
				isdanmu: false,
				isdanmuBtn: false,
				danmuList: [{
						text: '没有弹幕？',
						color: '#ffffff',
						time: 1
					},
					{
						text: '呜呜呜',
						color: '#ffffff',
						time: 3
					}
				],
				showVideo: false,
				time: '',
				actiTit: '',
				ws: null,
				path: '/pages/index/index',
				bannerCar:'',
				feiUrl:''
			}
		},
		onLoad() {
			const type = uni.getSystemInfoSync().uniPlatform
			if (type == 'mp-weixin') {
				console.log('在小程序内');
			} else {
				// this.getInfo()
				// this.checkWeChatCode()
			}
			// this.initWxConfig()

		},
		onShow() {
			this.connectWebSocket()
		},
		mounted() {
			this.getWeather()
			// var timer = setInterval(() => {
			// this.getNowTime()
			// }, 1000)
			this.getBanner()
			// this.scenicCategory()
		},
		onHide() {
			// 页面隐藏/切入后台时触发
			console.log('onHide')
			let that = this
			that.sendData({
				type: 'page_leave',
				path: that.path,
				params: ""
			});
		},
		onUnload() {
			// 页面卸载时触发
			  console.log('页面卸载');
			  let that = this
			  that.sendData({
			  	type: 'page_leave',
			  	path: that.path,
			  	params: ""
			  });
		},
		// 组件销毁时关闭定时器
		beforeDestroy() {
			// clearInterval(timer)
		},
		onPageScroll(e) {
			const that = this;
			that.scrollTop = e.scrollTop;
			// 监听页面滚动事件
			if (e.scrollTop >= 100) {
				this.showBack = true; // 滚动距离超过100px时显示返回顶部按钮
			} else {
				this.showBack = false; // 否则隐藏返回顶部按钮
			}
		},
		// onPageScroll(e) {
		// 	const that = this;
		// 	that.scrollTop = e.scrollTop;
		// },
		// onReachBottom() {
		// 	const that = this;
		// 	that.getlist();
		// },
		onReady() {

		},
		methods: {
		// 连接
		connectWebSocket() {
			let that = this
			const wsUrl = "wss://gxtravel.ncscloudmedia.com/wss"; // 确保使用wss（WebSocket Secure）如果服务器支持
			uni.connectSocket({
				url: wsUrl,
				success: function(res) {
					console.log('WebSocket连接成功');
					that.sendData({
						type: 'page_enter',
						path: that.path,
						params: ""
					});
				},
				fail: function(err) {
					console.error('WebSocket连接失败', err);
				}
			});
		},
		// 发送
		sendData(data) {
			uni.sendSocketMessage({
				data: JSON.stringify(data),
				success: function(res) {
					console.log('消息发送成功');
				},
				fail: function(err) {
					console.error('消息发送失败', err);
				}
			});
		},
			async getActiTit() {
				const result = await positionDetail({
					position_id: 30
				})
				const result2 = await positionDetail({
					position_id: 38
				})
				if (result.code == 1) {
					this.actiTit = result.data
				}
				if (result.code == 1) {
					this.bannerCar = result2.data.path
					this.feiUrl = result2.data.description
				}
			},
			handleTop() {
				uni.pageScrollTo({
					scrollTop: 0, // 滚动到页面顶部
					duration: 300 // 滚动动画持续时间，单位为毫秒
				});
			},
			//获取当前时间
			getNowTime() {
				var date = new Date();
				//年 getFullYear()：四位数字返回年份
				var year = date.getFullYear(); //getFullYear()代替getYear()
				//月 getMonth()：0 ~ 11
				var month = date.getMonth() + 1;
				//日 getDate()：(1 ~ 31)
				var day = date.getDate();
				//时 getHours()：(0 ~ 23)
				var hour = date.getHours();
				//分 getMinutes()： (0 ~ 59)
				var minute = date.getMinutes();
				//秒 getSeconds()：(0 ~ 59)
				var second = date.getSeconds();
				// var time = year + '-' + this.addZero(month) + '-' + this.addZero(day) + ' ' + this.addZero(hour) + ":" +
				// 	this.addZero(minute) + ':' + this.addZero(second);
				var time = this.addZero(month) + '-' + this.addZero(day);
				this.time = time
			},
			//小于10的拼接上0字符串
			addZero(s) {
				return s < 10 ? ('0' + s) : s;
			},
			close() {
				this.showVideo = false
				// console.log('close');
			},
			toShow(v) {
				this.showVideo = true
				this.video = v
				setTimeout(() => {
					const video = uni.createVideoContext('myVideo');
					video.play();
				}, 500)
			},
			async getConfig() {
				const result = await config()
				if (result.code == 1) {
					this.appid = result.data.appId
					this.checkWeChatCode()
				} else {

				}
			},
			getWeatherIcon(weather) {
				const weatherMap = {
					'晴天': '/static/images/icon5.png',
					'多云': '/static/images/icon3.png',
					'阴': '/static/images/icon9.png',
					'阵雨': '/static/images/icon2.png',
					'雨': '/static/images/icon2.png',
					'雷阵雨': '/static/images/icon12.png',
					'小雨': '/static/images/icon8.png',
					'中雨': '/static/images/icon2.png',
					'大雨': '/static/images/icon15.png',
					'暴雨': '/static/images/icon15.png',
					'大暴雨': '/static/images/icon15.png',
					'阵雪': '/static/images/icon7.png',
					'雪': '/static/images/icon7.png',
					'小雪': '/static/images/icon7.png',
					'中雪': '/static/images/icon1.png',
					'大雪': '/static/images/icon1.png',
					'暴雪': '/static/images/icon1.png',
					'雾': '/static/images/icon6.png',
					'冻雨': '/static/images/icon2.png',
					'沙尘暴': '/static/images/icon6.png',
					'小到中雨': '/static/images/icon2.png',
					'中到大雨': '/static/images/icon2.png',
					'大到暴雨': '/static/images/icon2.png',
					'暴雨到大暴雨': '/static/images/icon2.png',
					'大暴雨到特大暴雨': '/static/images/icon2.png',
					'小到中雪': '/static/images/icon1.png',
					'中到大雪': '/static/images/icon1.png',
					'大到暴雪': '/static/images/icon1.png',
					'浮尘': '/static/images/icon6.png',
					'扬沙': '/static/images/icon6.png',
					'强沙尘暴': '/static/images/icon6.png',
					'浓雾': '/static/images/icon6.png'
				};
				return weatherMap[weather] || '/static/images/qt.png';
			},
			// 获取天气
			getWeather(loc) {
				let that = this
				that.$jsonp('https://apis.map.qq.com/ws/weather/v1/', {
					key: "F2GBZ-2II6X-EQB4R-7MYZJ-K3S3E-KKBNB",
					location: '28.694426,115.975846',
					output: 'jsonp'
				}).then(res => {
					if (res.result.realtime) {
						console.log(res.result.realtime)
						that.weather = res.result.realtime[0].infos
					}
				}).catch(err => {
					console.log(err);
				});

				// uni.request({
				// 	url: 'https://apis.map.qq.com/ws/weather/v1/', //仅为示例，并非真实接口地址。
				// 	data: {
				// 		adcode: 130681,
				// 		key: "F2GBZ-2II6X-EQB4R-7MYZJ-K3S3E-KKBNB",
				// 	},
				// 	success: (response) => {
				// 		console.log(response)
				// 	}
				// });
			},
			async getInfo() {
				const result = await userDetail()
				if (result.code == 10000 || result.code == 20003) {
					// this.wxLogin()
					this.getConfig()
				} else if (result.code == 1) {
					this.info = result.data
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					})
				}
			},
			wxLogin() {
				let local = encodeURIComponent(window.location.href); //获取当前页面地址作为回调地址
				let appid = this.appid
				//通过微信官方接口获取code之后，会重新刷新设置的回调地址【redirect_uri】
				let href = "https://ncymkj.doudou00.com/get-weixin-code.html?appid=" + appid +
					"&response_type=code&scope=snsapi_userinfo&state=123456&redirect_uri=" + local + "#wechat_redirect"
				console.log(href)
				window.location.href = href
			},
			//检查浏览器地址栏中微信接口返回的code
			checkWeChatCode() {
				let code = this.getUrlCode('code')
				if (code) {
					// uni.showToast({
					// 	title: `微信code=${code}`
					// })
					this.getOpenidAndUserinfo(code)
				} else {
					this.wxLogin()
					// this.getInfo()
				}
			},
			//方法：用来判断是否是微信内置的浏览器
			isWechat() {
				return String(navigator.userAgent.toLowerCase().match(/MicroMessenger/i)) === "micromessenger";
			},
			getUrlCode(name) {
				return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) ||
				[, ''
				])[1].replace(/\+/g, '%20')) || null
			},
			async getOpenidAndUserinfo(code) {
				this.show = true
				const result = await wechatLogin({
					code: code
				})
				if (result.code == 1) {
					uni.setStorageSync('token', result.data.token);
					this.getInfo()
					this.sendData({
						type: 'user_auth',
						token: result.data.token,
					});
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'none'
					});
					// window.location.replace(
					// 	"https://gxtravel.ncscloudmedia.com/h5/#/"
					// );
				}
			},
			toSearch() {
				if (this.keyword == '') {
					uni.showToast({
						title: '请输入关键字搜索',
						icon: 'none'
					})
					return false
				}
				uni.navigateTo({
					url: '/pages/search/search?keyword=' + this.keyword
				})
			},
			dailyMethod() {
				let that = this
				// 获取当前时间
				const now = new Date();
				const nowString = now.toLocaleDateString(); // 获取日期字符串，格式如 "2023/3/15"

				// 从本地存储获取上一次执行时间
				uni.getStorage({
					key: 'lastExecTime',
					success: (res) => {
						if (res.data !== nowString) {
							// 如果上次执行时间不是今天，则执行方法
							console.log('执行每日方法');
							// 这里放置你的代码逻辑
							// that.getWeather()
							// 更新本地存储为今天的时间
							uni.setStorage({
								key: 'lastExecTime',
								data: nowString
							});
						} else {
							console.log('今天已执行过');
						}
					},
					fail: () => {
						// 如果本地存储中没有上次执行时间，则认为是第一次运行，直接执行方法并存储当前时间
						console.log('执行每日方法');
						// 这里放置你的代码逻辑
						uni.setStorage({
							key: 'lastExecTime',
							data: nowString
						});
					}
				});
			},
			async getBanner() {
				const result = await positionList({
					position_id: 1
				})
				const result2 = await positionList({
					position_id: 31
				})

				if (result.code == 1) {
					this.bannerList = result.data
					this.getNav()

				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					});
				}
				if (result2.code == 1) {
					this.bannerList2 = result2.data
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					});
				}
			},
			async getNav() {
				const result = await positionList({
					position_id: 5
				})
				if (result.code == 1) {
					this.navList = result.data
					const result2 = await positionList({
						position_id: 14
					})
					if (result2.code == 1) {
						result2.data.forEach(item => {
							item.src = item.path.split(',')
							item.name = item.title
						})
						this.srcList = result2.data
						this.getActiTit()
						this.getlist()
						// this.getScenic()
					} else {
						uni.showToast({
							title: result.msg,
							icon: 'error'
						});
					}
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					});
				}
			},
			async getScenic() {
				const result1 = await positionList({
					position_id: 6
				})
				if (result1.code == 1) {
					this.scenicList1 = result1.data
					const result2 = await positionList({
						position_id: 7
					})
					if (result2.code == 1) {
						this.scenicList2 = result2.data
						const result3 = await positionList({
							position_id: 8
						})
						if (result3.code == 1) {
							this.scenicList3 = result3.data
							const result4 = await positionList({
								position_id: 9
							})
							if (result4.code == 1) {
								this.scenicList4 = result4.data
								const result5 = await positionList({
									position_id: 10
								})

								// if (result5.code == 1) {
								// 	this.scenicList5 = result5.data
								// 	const result6 = await positionList({
								// 		position_id: 18
								// 	})
								// 	if (result6.code == 1) {
								// 		this.scenicList6 = result6.data
								// 		const food1 = await positionList({
								// 			position_id: 21
								// 		})
								// 		if (food1.code == 1) {
								// 			this.foodList1 = food1.data
								// 			const food2 = await positionList({
								// 				position_id: 22
								// 			})
								// 			if (food2.code == 1) {
								// 				this.foodList2 = food2.data
								// 				const food3 = await positionList({
								// 					position_id: 23
								// 				})
								// 				if (food3.code == 1) {
								// 					this.foodList3 = food3.data
								// 					const food4 = await positionList({
								// 						position_id: 24
								// 					})
								// 					if (food4.code == 1) {
								// 						this.foodList4 = food4.data
								// 						const food5 = await positionList({
								// 							position_id: 25
								// 						})
								// 						if (food5.code == 1) {
								// 							this.foodList5 = food5.data
								// 						}
								// 					}
								// 				}
								// 			}
								// 		}
								// 	}
								// }
							}
						}
					}
				}












			},
			async getArticle() {
				const result = await articleList({
					channel_id: 2,
					page: 1,
					size: 5
				})
				if (result.code == 1) {
					this.articleList = result.data.list
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					});
				}
			},
			toWei() {
				wx.miniProgram.openLaunchWeApp({
					appId: 'wxeea05d105d34428b', // 小程序原始id
					path: 'pages/index/index', // 打开的页面路径，如果为空则打开首页
					success(res) {
						// 打开成功
					},
					fail(res) {
						// 打开失败
					}
				});
				// uni.navigateToMiniProgram({
				// 	appId:'wxeea05d105d34428b',
				// 	path:'pages/index/index',
				// 	success(res) {
				// 		console.log(res)
				// 	},
				// 	fail(res) {
				// 		console.log(res)
				// 	}
				// })
			},
			toMuted() {
				const video = uni.createVideoContext('myVideo', this);
				this.muted = !this.muted; // 切换静音状态
				video.muted = this.muted; // 设置视频为静音或取消静音
			},
			toPlay2() {
				const video = this.$refs.myVideo;
				video.play();
			},
			toPlay() {
				const video = this.$refs.myVideo;
				if (video.playing) {
					video.pause();
				} else {
					video.play();
				}
			},
			toUrl(u, img, de) {
				if (u == '') {
					if (de == '') {
						uni.previewImage({
							urls: [img],
							current: img
						})
					} else {
						// window.location.href = de
						// wx.miniProgram.getEnv(function (result) {
						//        if (result.miniprogram) {
						//          wx.miniProgram.navigateTo({
						//            url: "/pages/article/index?de="+de,
						//          });
						//        }
						//      });
						wx.openOfficialAccountArticle({
						         url:de, // 此处填写公众号文章连接
						         success: res => {
						         },
						         fail: res => {
						         }
						     })
					}


				} else {
					uni.navigateTo({
						url: u
					})
				}
			},
			async initWxConfig() {
				const result = await config()
				if (result.code == 1) {
					wx.config({
						debug: result.data.debug, // 生产环境设置为 false
						appId: result.data.config.appId,
						timestamp: result.data.config.timestamp,
						nonceStr: result.data.config.nonceStr,
						signature: result.data.config.signature,
						jsApiList: result.data.config.jsApiList,
						openTagList: ['wx-open-launch-weapp']
					});
			
					wx.ready(() => {
						// alert("微信 JS SDK 已就绪");
					});
			
					wx.error((err) => {
						// alert("微信 JS SDK 配置错误：", err);
					});
				} else {
			
				}
			
			
			},
			toAct(e) {
				console.log(e)
				this.act = e
				this.getArticle()
			},
			toAct2(e) {
				console.log(e)
				this.act2 = e
				this.list = []
				this.page = 0
				this.getlist()
			},
			async getlist() {
				const that = this;
				const {
					totalPage,
					page,
					offset,
					list,
					act2,
				} = that;
				let obj = {
					size: 20,
					page: 1,
					category_id: act2
				};
				let result = await scenicList(obj);
				that.getArticle()
				if (result.code == 1) {
					that.list = result.data.list
				}
			},
			async scenicCategory() {
				const result = await scenicCategory({
					parent_id: 2
				})
				if (result.code == 1) {
					console.log(result.data)
					this.routeList = result.data
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'error'
					});
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background: #F6F7FB;
	}

	.back-to-top {
		bottom: 180rpx;
		right: 10rpx;
		z-index: 50;
	}

	.actView {
		// width: 100%;
		margin: 0rpx 30rpx 10rpx;
		position: relative;

		image {
			width: 100%;
		}

		.actViewTex {
			position: absolute;
			top: 44rpx;
			left: 40rpx;
			color: #fff;

			.Tex:nth-child(1) {
				font-weight: bold;
				margin-bottom: 8rpx;
				font-size: 42rpx;
				letter-spacing: 6px;
				text-shadow: 1rpx 1rpx 8rpx rgba(0, 0, 0, 0.30);
			}
			.Tex:nth-child(2){
				text-shadow: 1rpx 1rpx 8rpx rgba(0, 0, 0, 0.30);
			}
		}
	}

	// .content {
	// 	padding-bottom: 300rpx;
	// }

	.uni-margin-wrap {
		position: relative;

		.search {
			background: linear-gradient(to right, #01B192, #01B192, #12D5B4);
			padding: 30rpx 0;
			position: fixed;
			width: 100%;
			z-index: 20;
			top: 0;
			left: 0;
			height: 75rpx;

			// width: 86%;
			.address {
				font-size: 20rpx;
				color: white;
				text-align: center;
				margin-right: 20rpx;
				margin-left: 30rpx;

				.addressName {
					font-size: 28rpx;
					letter-spacing: 6rpx;
				}
			}
		}

		.swiper {
			height: 740rpx;
			margin: 160rpx 30rpx 30rpx;
			border-radius: 16rpx;

			image {
				width: 100%;
				height: 100%;
				border-radius: 16rpx;
			}

			.swiper-title {
				position: absolute;
				bottom: 15rpx;
				right: 30rpx;
				// background: rgba(255, 255, 255, 0.5);
				font-size: 24rpx;
				// padding: 5rpx 10rpx;
				border-radius: 20rpx;
				// background: rgba(51, 51, 51, 0.5);
				color: white;
				text-shadow: 1rpx 2rpx 1rpx gray;
			}
		}

		.swiper3 {
			margin: 15rpx 30rpx 30rpx;
			height: 450rpx;
		}
	}

	.swiperLogo {
		position: absolute;
		width: 400rpx;
		// margin-top: 40rpx;
		top: 80rpx;
		left: 50%;
		margin-left: -200rpx;
		z-index: 8;
	}

	.img-name {
		text-shadow: 1rpx 2rpx 1rpx gray;
	}

	.swiper2 {
		height: 100%;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.navView {
		background: white;
		border-radius: 16rpx;
		padding: 16rpx 0rpx;
		position: relative;
		margin: 0 30rpx 32rpx;
		// top: -20rpx;

		.navs {
			padding: 0;
			flex-wrap: wrap;

			.nav-item {
				font-size: 24rpx;
				text-align: center;
				width: 25%;
				margin-bottom: 16rpx;

				image {
					width: 96rpx;
					height: 96rpx;
				}

				// .image {
				// 	width: 60rpx;
				// 	height: 60rpx;
				// }
			}
		}

		.banner2 {
			width: 100%;
			display: block;
			margin: 20rpx 0;
		}

		.news {
			padding: 18rpx 20rpx;
			background: #F7FAFC;
			border-radius: 24rpx;

			.news-icon1 {
				width: 64rpx;
				height: 52rpx;
				margin-right: 20rpx;
			}

			.news-icon2 {
				width: 64rpx;
				height: 32rpx;
				margin-right: 20rpx;
			}

			.point {
				background: #333333;
				width: 8rpx;
				height: 8rpx;
				margin-right: 20rpx;
				border-radius: 50%;
			}

			.title {
				font-size: 28rpx;
				width: 55%;
			}

			.more {
				color: #878787;
				font-size: 28rpx;
				margin-right: 16rpx;
			}

			.news-icon3 {
				width: 30rpx;
				height: 30rpx;
			}
		}


	}

	.video {
		// background: white;
		margin: 0 30rpx;
		// width: 93%;
		position: relative;
		padding-bottom: 0rpx;

		.videoTab {
			position: absolute;
			top: 20rpx;
			left: 18rpx;
			z-index: 9;
			background: #00af91ad;
			color: white;
			font-size: 28rpx;
			padding: 0px 22rpx;
			border-radius: 40rpx;
		}

		video {
			width: 100%;
			background: white;
			height: 388rpx;
			object-fit: cover;
		}

		.icon {
			position: absolute;
			top: 5rpx;
			right: 20rpx;
		}
	}

	.main-list {
		position: relative;
		padding: 1rpx 30rpx 300rpx;

		.list-bg {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			display: block;
		}

		.list-tit {
			position: relative;
			padding-bottom: 10rpx;
			width: fit-content;

			view {
				color: #00AF91;
				font-size: 38rpx;
				left: 0;
				bottom: 0rpx;
				transition: font-size 0.5s ease
			}

			image {
				position: absolute;
				width: 100%;
				height: 100%;

			}
		}

		.list-tit2 {
			color: #141414;
			font-size: 32rpx;
			position: relative;
			margin-left: 20rpx;
			transition: font-size 0.5s ease // top: 10rpx;
		}

		.list-tit3 {
			color: #141414;
			font-size: 32rpx;
			position: relative;
			transition: font-size 0.5s ease // top: 20rpx;
		}

		@keyframes colorChange {
			0% {
				color: red;
			}

			50% {
				color: blue;
			}

			100% {
				color: green;
			}
		}

		.jingdian {
			margin-top: 20rpx;

			.jing1 {
				width: 336rpx;
				height: 336rpx;
				position: relative;

				.img {
					width: 100%;
					height: 100%;
					border-radius: 16rpx;
				}

				.jing1-tit {
					position: absolute;
					left: 64rpx;
					top: 0;

					image {
						width: 209rpx;
						height: 57.33rpx;
					}

					view {
						position: absolute;
						font-size: 32rpx;
						color: white;
						top: 0%;
						left: 42rpx;
					}

				}

				.jing-name {
					position: absolute;
					left: 16rpx;
					bottom: 16rpx;
					color: white;
					font-size: 28rpx;
					padding: 4rpx 16rpx;
					border-radius: 24rpx;
					background: #00000094;
				}
			}

			.jing2 {
				width: 336rpx;

				.jing2-list {
					height: 160rpx;
					position: relative;
					margin-bottom: 10rpx;

					image {
						width: 336rpx;
						height: 100%;
						border-radius: 16rpx;
						display: block;
					}

					view {
						position: absolute;
						left: 32rpx;
						bottom: 20rpx;
						color: white;
						font-size: 28rpx;
						padding: 4rpx 16rpx;
						border-radius: 24rpx;
						background: #00000094;
					}
				}
			}
		}

		.jingdain2 {
			height: 158rpx;
			margin-top: 20rpx;

			.jing1 {
				width: 336rpx;
				height: 100%;
				position: relative;

				.jing-name {
					position: absolute;
					left: 16rpx;
					bottom: 16rpx;
					color: white;
					font-size: 28rpx;
					padding: 4rpx 16rpx;
					border-radius: 24rpx;
					background: #00000094;
				}

				image {
					border-radius: 16rpx;
				}
			}
		}

		.gonglue {
			position: relative;
			// background: white;
			overflow-x: auto;
			white-space: nowrap;

			.gongList {
				display: inline-block;
				border-radius: 16rpx;
				width: 310rpx;
				margin-bottom: 20rpx;
				box-shadow: 1rpx 2rpx 10rpx 2rpx gainsboro;
				margin-right: 20rpx;

				.image {
					position: relative;

					image {
						width: 100%;
						height: 372rpx;
						border-radius: 16rpx 16rpx 0 0;
						display: block;
					}

					.name {
						position: absolute;
						left: 16rpx;
						bottom: 16rpx;
						color: white;
						font-size: 24rpx;
						padding: 4rpx 16rpx;
						border-radius: 24rpx;
						background: #00000094;
					}
				}

				.infos {
					border-radius: 0 0 16rpx 16rpx;
					font-size: 28rpx;
					padding: 12rpx 16rpx 16rpx;
					background: white;

					.eye {
						color: #6C7A94;
						font-size: 24rpx;
						margin-top: 12rpx;
						// justify-content: flex-end;

						image {
							width: 40rpx;
							height: 40rpx;
							margin-right: 12rpx;
						}
					}

					.title {
						font-size: 24rpx;

						// align-items: flex-start;
						view {
							// width: 80%;
							overflow: hidden; //超出隐藏
							text-overflow: ellipsis; //溢出用省略号...显示
							display: -webkit-box; //将对象作为弹性伸缩盒子模型显示。
							-webkit-box-orient: vertical; //从上到下垂直 排列子元素（设置伸缩盒子的子元素排列方式）
							-webkit-line-clamp: 1; //表示显示的行数合上面两个属性，表示显示的行数
						}
					}
				}
			}
		}

		.zixunNav {
			margin: 40rpx 0 20rpx;
			height: 60rpx;
			white-space: nowrap;
			overflow-x: auto;
			overflow-y: hidden;

			.list-tit,
			.list-tit3,
			.list-tit2 {
				display: inline-block;
			}
		}

		.zixunList {
			// overflow-x: auto;
			// white-space: nowrap;

			.bookList {
				margin: 20rpx 0;
				box-shadow: 1rpx 2rpx 10rpx 2rpx gainsboro;
				padding: 20rpx;
				border-radius: 20rpx;
				background: white;
				position: relative;

				image {
					width: 184rpx;
					height: 150rpx;
					object-fit: cover;
					border-radius: 18rpx;
				}

				.list-right {
					margin-left: 12rpx;
					width: 73%;
					position: relative;
					// height: 184rpx;

					.tit {
						color: #333333;
						font-size: 30rpx;
						// height: 72rpx;
						margin-bottom: 100rpx;
						overflow: hidden; //超出隐藏
						text-overflow: ellipsis; //溢出用省略号...显示
						display: -webkit-box; //将对象作为弹性伸缩盒子模型显示。
						-webkit-box-orient: vertical; //从上到下垂直 排列子元素（设置伸缩盒子的子元素排列方式）
						-webkit-line-clamp: 1; //表示显示的行数合上面两个属性，表示显示的行数
					}

					.info {
						color: #666666;
						font-size: 24rpx;
						margin: 10rpx 0;
					}

					.eye {
						color: #6C7A94;
						font-size: 24rpx;
						position: absolute;
						bottom: 0;
						width: 100%;
					}
				}

				// view {
				// 	position: absolute;
				// 	bottom: 15rpx;
				// 	color: white;
				// 	font-size: 24rpx;
				// 	width: 260rpx;
				// 	white-space: wrap;
				// 	padding: 4rpx 16rpx;
				// 	border-radius: 24rpx;
				// 	background: #00000094;
				// 	overflow: hidden; //超出隐藏
				// 	text-overflow: ellipsis; //溢出用省略号...显示
				// 	display: -webkit-box; //将对象作为弹性伸缩盒子模型显示。
				// 	-webkit-box-orient: vertical; //从上到下垂直 排列子元素（设置伸缩盒子的子元素排列方式）
				// 	-webkit-line-clamp: 1; //表示显示的行数合上面两个属性，表示显示的行数
				// }
			}
		}
	}
</style>